/* padding */
.p0 {
  padding: 0 !important;
}

.p2 {
  padding: $dis2;
}

.p5 {
  padding: $dis5;
}

.p10 {
  padding: $dis10;
}

.p20 {
  padding: $dis20;
}

//
.p0-2 {
  padding: 0 $dis2;
}

.p0-5 {
  padding: 0 $dis5;
}

.p0-10 {
  padding: 0 $dis10;
}

.p0-15 {
  padding: 0 $dis15;
}

.p0-20 {
  padding: 0 $dis20;
}

//
.p2-0 {
  padding: $dis2 0;
}

.p5-0 {
  padding: $dis5 0;
}

.p10-0 {
  padding: $dis10 0;
}

.p15-0 {
  padding: $dis15 0;
}

.p20-0 {
  padding: $dis20 0;
}

//
.p5-10 {
  padding: $dis5 $dis10;
}

.p10-20 {
  padding: $dis10 $dis20;
}

.p20-10 {
  padding: $dis20 $dis10;
}

.p10-5 {
  padding: $dis10 $dis5;
}

//
.pr0 {
  padding-right: 0 !important;
}

.pr2 {
  padding-right: $dis2;
}

.pr5 {
  padding-right: $dis5;
}

.pr10 {
  padding-right: $dis10;
}

.pr15 {
  padding-right: $dis15;
}

.pr20 {
  padding-right: $dis20 !important;
}

//
.pl0 {
  padding-left: 0;
}

.pl2 {
  padding-left: $dis2;
}

.pl3 {
  padding-left: $dis3;
}

.pl5 {
  padding-left: $dis5;
}

.pl10 {
  padding-left: $dis10;
}

.pl20 {
  padding-left: $dis20;
}

//
.pt0 {
  padding-top: 0;
}

.pt2 {
  padding-top: $dis2;
}

.pt5 {
  padding-top: $dis5;
}

.pt10 {
  padding-top: $dis10;
}

.pt20 {
  padding-top: $dis20;
}

//

.pb0 {
  padding-bottom: 0;
}

.pb2 {
  padding-bottom: $dis2;
}

.pb5 {
  padding-bottom: $dis5;
}

.pb10 {
  padding-bottom: $dis10;
}

.pb20 {
  padding-bottom: $dis20;
}

/* margin */

.m0 {
  margin: 0;
}

.m2 {
  margin: $dis2;
}

.m5 {
  margin: $dis5;
}

.m10 {
  margin: $dis10;
}

.m15 {
  margin: $dis15;
}

.m20 {
  margin: $dis20;
}

//
.ml0 {
  margin-left: 0;
}

.ml5 {
  margin-left: $dis5;
}

.ml2 {
  margin-left: $dis2;
}

.ml10 {
  margin-left: $dis10;
}

.ml15 {
  margin-left: $dis15;
}

.ml20 {
  margin-left: $dis20;
}

//
.mr0 {
  margin-right: 0;
}

.mr2 {
  margin-right: $dis2;
}

.mr5 {
  margin-right: $dis5;
}

.mr10 {
  margin-right: $dis10;
}

.mr15 {
  margin-right: $dis15;
}

.mr20 {
  margin-right: $dis20;
}

//

.mt0 {
  margin-top: 0;
}

.mt1 {
  margin-top: 1px;
}

.mt2 {
  margin-top: $dis2;
}

.mt5 {
  margin-top: $dis5;
}

.mt10 {
  margin-top: $dis10;
}

.mt15 {
  margin-top: $dis15;
}

.mt20 {
  margin-top: $dis20;
}

// 
.mb0 {
  margin-bottom: 0 !important;
}

.mb2 {
  margin-bottom: $dis2;
}

.mb5 {
  margin-bottom: $dis5 !important;
}

.mb10 {
  margin-bottom: $dis10;
}

.mb15 {
  margin-bottom: $dis15;
}

.mb20 {
  margin-bottom: $dis20;
}

// 

.w24 {
  width: 24px;
}

.w36 {
  width: 36px;
}

.w48 {
  width: 48px;
}

.w80 {
  width: 80px;
}

.w90 {
  width: 90px;
}

.w100 {
  width: 100px;
}

.w120 {
  width: 120px;
}

.w150 {
  width: 150px;
}

.w200 {
  width: 200px;
}

.w240 {
  width: 240px;
}

.w300 {
  width: 300px;
}

.w360 {
  width: 360px;
}

.w400 {
  width: 400px;
}

.h24 {
  height: 24px;
}

.h28 {
  height: 28px;
}

.h36 {
  height: 36px;
}

.h48 {
  height: 48px;
}

.h56 {
  height: 56px;
}

.h60 {
  height: 60px;
}

.h80 {
  height: 80px;
}

.h100 {
  height: 100px;
}

.h5rem {
  height: 5rem;
}

.h120 {
  height: 120px;
}

.h150 {
  height: 150px;
}

.h200 {
  height: 200px;
}

.h240 {
  height: 240px;
}
.h300 {
  height: 300px;
}
.h400 {
  height: 400px;
}

.minw36 {
  min-width: 36px;
}

.mh240 {
  max-height: 240px;
}

.mh300 {
  max-height: 300px;
}

.wp20 {
  width: 20%;
}

.wp25 {
  width: 25%;
}

.wp33 {
  width: calc(100% / 3) !important;
}

.wp50 {
  width: 50% !important;
}
.wp70 {
  width: 70% !important;
}

.wp100 {
  width: 100% !important;
}

.hp100 {
  height: 100% !important;
}

.vh100 {
  height: 100vh !important;
}